Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat(runtime-core): Add ”InversionValue“ peculiarity,makes it easier to pass false to props #12280

Open
wants to merge 3 commits into
base: main
Choose a base branch
from

Conversation

mrwdhasd0903
Copy link

As we all know, when we need to pass true to a component, we can ignore the true value, like:

<template>
    <a-modal v-model:open="open" mask>
      Some contents...
    </a-modal>
</template>
<script lang="ts" setup>
import { ref } from 'vue';
const open = ref<boolean>(false);

</script>

mask is a boolean value, so we can ignore the true value, but I need to set mask to false, template is:

<template>
    <a-modal v-model:open="open" :mask="false">
      Some contents...
    </a-modal>
</template>

If :mask="false" can be shortened to !mask, I think it's a really great grammar candy.

The final result is:

<template>
    <a-modal v-model:open="open" !mask>
      Some contents...
    </a-modal>
</template>

@mrwdhasd0903 mrwdhasd0903 changed the title Add ”InversionValue“ peculiarity,makes it easier to pass false to props feat(runtime-core): Add ”InversionValue“ peculiarity,makes it easier to pass false to props Oct 28, 2024
@mrwdhasd0903
Copy link
Author

click open demo: playground

@edison1105
Copy link
Member

edison1105 commented Oct 28, 2024

It looks like this is a good feature, but the implementation is not quite right. I think it should handle !foo as foo="false" during compilation, rather than modifying the runtime code.

the following code

<Comp !stat/>

compiled to

_createVNode($setup["Comp"], { "stat": false })

instead of

_createVNode($setup["Comp"], { "!stat": "" })

Additionally, it needs support from the language-tool.

BTW, this is a feature in vue-macros, see https://vue-macros.dev/features/boolean-prop.html

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants